<ion-header class="telephone-auth-header">
  <ion-navbar hideBackButton="true">
    <ion-buttons start navPop class="back-buttons">
      <button ion-button clear></button>
    </ion-buttons>

    <ion-title float-left>运营商授权</ion-title>
  </ion-navbar>
</ion-header>


<ion-content class="telephone-auth-section">

  <div class="tel-auth-title">
    <p>通过VeriSign国际安全认证</p>
  </div>
  <form #telephoneRef="ngForm">
  <ion-list>
    <ion-item>
      <h2>机主姓名</h2>
      <div>{{userInfo.name}}</div>
    </ion-item>

    <ion-item>
      <h2>身份证号码</h2>
      <div>{{userInfo.idNo | identity}}</div>
    </ion-item>

    <ion-item>
      <h2>手机号码</h2>
      <div>{{ userInfo.phone | telephone }}</div>
    </ion-item>

    <ion-item>
      <h2>运营商归属</h2>
      <div>{{ userInfo.collect_website }}</div>
    </ion-item>

    <ion-item *ngIf="!userInfo.plan">
      <h2>服务密码</h2>
      <input [(ngModel)]="pwd"
             [type]="switchover.type"
             class="password-input"
             name="servicePassword"
             placeholder="请输入6位服务密码"
             #telephoneRef="ngModel"
             maxlength="6"
             required
      >
      <p *ngIf="pwd.length>0"
         class="switchover-password"
         (click)="switchoverPassword(switchover)"
         [class.active]="!switchover.status"
      ></p>
    </ion-item>

    <ion-item *ngIf="userInfo.plan">
      <h2>短信验证</h2>
      <input [(ngModel)]="msgCode"
             type="text"
             name="msg_code"
             class="msg-code-input"
             #telephoneRef="ngModel"
             placeholder="请输入短信验证码"
             maxlength="6"
             required
      >

      <p *ngIf="msgCode.length>0"
            class="clear-button"
            (click)="clearMsgCode()"
      ></p>

    </ion-item>

  </ion-list>
  </form>

  <div class="agree-protocol">
    <span [class.active]="hasActive" (click)="executeChange()"></span>
    <div>同意<a (click)="doServiceAgreement()">《电信运营商数据采集服务协议》</a></div>
  </div>

  <div class="submit-button">
    <button ion-button
            block
            (click)="executeMobileLogin()"
            [disabled]="!(telephoneRef.valid &&hasActive)"
            color="secondary"
    >提交</button>
  </div>

  <!--<div class="submit-button" *ngIf="userInfo.plan">
    <button ion-button
            block
            (click)="executeSave()"
            [disabled]="!(telephoneRef.valid &&hasActive)"
            color="secondary"
    >认证</button>
  </div>-->

  <!--<div class="other-login">
    <button ion-button
            clear
    >使用短信验证码登录</button>
  </div>


  <div class="help-info">
    <p>忘记服务密码?</p>

    <div class="item-title">
      <div>短信找回服务密码</div>
      <button ion-button outline color="primary">短信找回</button>
    </div>
    <ul>
      <li>1.发送【MMCZ#6位新密码#证件号6位】到10010</li>
      <li>2.根据返回的短信提示内容进行操作</li>
    </ul>
    <div class="item-title">
      <div>在线找回服务密码</div>
      <button ion-button outline>在线找回</button>
    </div>

    <ul>
      <li>1.借款通过申请后,我们将会将你的所借款该张银行卡;</li>
      <li>2.若申请重新绑卡,则新卡将激活为收款银行卡;</li>
    </ul>
  </div>-->
</ion-content>
